<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
    <script src="//unpkg.com/vue/dist/vue.js"></script>
</head>

<body>
    <div id="app">
        {{ fullName }}
        <!-- 字符串倒置操作 reverse（）是倒置数组  join（）是拼接 -->
    </div>

    <script>
        // 当firstName和lastName改变的时候，fullName也要改变。
        let vue = new Vue({
            el: "#app",
            data: {
                firstName: '尼古拉斯',
                lastName: '赵四',
                fullName: '尼古拉斯 赵四'
            },
            watch:{
                firstName: function(val){
                    this.fullName = val+" "+this.lastName
                },
                lastName: function(val){
                    this.fullName = this.firstName+" "+val
                }
            }
        })
    </script>
</body>

</html>